
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
        <title>wgs</title>
        <link rel="stylesheet" type="text/css" href="layui/css/layui.css" />
        <script src="layui/layui.all.js"></script>
        <script src="layui/lianlin.js"></script>
        <link rel="stylesheet" type="text/css" href='layui/css/style.css' />
	
		<style type="text/css">
			ul{bottom: 0; top: 0;}
			.main{margin-left: 200px; position: absolute; right: 0; left: 0;}
			.main #view1{width: 100%; }
			.main > button{margin-left: 0px; margin-top: 10px;}
			.layui-layer-tips .layui-layer-content{
				background-color: transparent;
            }
            .layui-icon{margin-right: 15px;color:skyblue;font-size: 15px}
			
        </style>
        
		<script type="text/javascript">
			//为了保证不出现一闪而过的菜单栏, 放在了前面进行加载这段代码
			$().ready(() => {
				var a = $('.dynamic-navigation');			
				localStorage.getItem('nav-status') == 1 ? (
					$('.dynamic-navigation').attr("tg", "1").css('left', '-200px'),
					$('.layui-layer-tips').css('left', '89px')
				) : (
					console.log(localStorage.getItem('nav-status'))
				);
				
			});
		</script>
	</head>

<body class="layui-form" style="overflow-x:hidden;background-color:#eee">
    <div class="layui-row layui-col-space20">
        <div class="layui-col-xs12">
            <ul lay-shrink='all' class="layui-nav layui-nav-tree layui-nav-side dynamic-navigation" lay-filter="test" style="position: fixed;" >
                <div style="text-align: center;">
                    <a href='http://www.guomaigene.com/home' target='_blank'><img style="width: 70%;height:5%;margin-bottom: 50px;margin-top: 50px;" src="img/logo.png" /></a>
                </div>
                <li class="layui-nav-item layui-nav-itemed">
                    <a href="page/项目背景/background.html" target="myFrame"><i class="layui-icon layui-icon-home" ></i>项目背景</a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="page/项目背景/general_stat.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>结果概述</a>
                        </dd>
                        <dd>
                            <a href="page/项目背景/sample_info.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>样本信息</a>
                        </dd>
                        <dd>
                            <a href="page/项目背景/software_used.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>软件列表</a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="page/测序数据质控/background.html" target="myFrame"><i class="layui-icon layui-icon-diamond" ></i>测序数据质控</a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="page/测序数据质控/qc.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>测序数据质控</a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="page/基因组比对/background.html" target="myFrame"><i class="layui-icon layui-icon-component" ></i>基因组比对</a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="page/基因组比对/mapping_stat.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>比对信息统计</a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="page/短变异位点检测/background.html" target="myFrame"><i class="layui-icon layui-icon-table" ></i>短变异位点检测</a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="page/短变异位点检测/variant_stat.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>变异位点数据统计</a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="page/SV变异检测/background.html" target="myFrame"><i class="layui-icon layui-icon-chart" ></i>SV变异检测</a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="page/SV变异检测/sv_stat.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>SV变异统计</a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="page/CNV变异检测/background.html" target="myFrame"><i class="layui-icon layui-icon-chart-screen" ></i>CNV变异检测</a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="page/CNV变异检测/cnv_stat.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>CNV变异统计</a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="page/标记分布可视化/background.html" target="myFrame"><i class="layui-icon layui-icon-picture-fine" ></i>标记分布可视化</a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="page/标记分布可视化/marker_stat.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>标记位点染色体分布</a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="page/基因功能注释/background.html" target="myFrame"><i class="layui-icon layui-icon-list" ></i>基因功能注释</a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="page/基因功能注释/denovo_annotation.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>denovo 基因组功能注释</a>
                        </dd>
                        <dd>
                            <a href="page/基因功能注释/pathway.html" target="myFrame"><i class="layui-icon layui-icon-note" ></i>基因富集分析</a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <p style="margin-top:50%;text-align: center"><a href="https://github.com/N-damo" target="_blank">Designed by Li'an Lin</a></p>
                </li>
            </ul>
           
    
            <div class="layui-fluid">
                <div class="main dynamic-navigation">
                    <ul class="layui-nav layui-bg-blue" >
                        <li class="layui-nav-item"><a href="http://www.guomaigene.com/home" target='_blank'>首页</a></li>
                        <li class="layui-nav-item" ><a href="http://www.guomaigene.com/goods" target='_blank'>基因产品</a></li>
                        <li class="layui-nav-item" ><a href="http://www.guomaigene.com/detection" target='_blank'>基因检测</a></li>
                        <li class="layui-nav-item" ><a href="http://www.guomaigene.com/report/itemList" target='_blank'>示例报告</a></li>
                        <li class="layui-nav-item"><a href="http://www.guomaigene.com/about" target='_blank'>关于我们</a></li>
                        <li class="layui-nav-item"><a href="http://www.guomaigene.com/login/signIn?redirect=%2Fpersonal%2Fpersonal-info" target='_blank'>个人中心</a></li>
                        <li class="layui-nav-item"><a href='mailto:guomaigene@gmiot.com' >反馈</a></li>
                    </ul> 
                    <button class="layui-btn layui-btn-primary" id="left" title='收缩/展开'><i  class="layui-icon layui-icon-shrink-right" id="left_icon" ></i></button>

                    <div id="view1">
                            
                        <div class="layui-row layui-col-space20">
                            <div id='content' class="layui-col-xs12 layui-col-lg12"  style='margin-top: -30px;margin-left:60px;'>
                                <iframe src='page/项目背景/background.html' name="myFrame" croling="yes" frameborder="0" width="90%" height="100%"></iframe>
                            </div>
                            <div class="layui-col-xs12 layui-col-lg12" style="background-color: darkgrey;color: white;font-size: 15px;">
                                <div class="layui-container" style='margin-left: 50%;margin-right: 40%;'>国脉生物科技有限公司</div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>

<script>
var $=layui.jquery;
var h=$(window).height();
$('#content').height(h);
</script>

<script>
var form=layui.form, $=layui.jquery;
form.render();
$('#left').click(function(){
    $(this).children(".layui-icon").toggleClass("layui-icon-spread-left");
    $(this).children(".layui-icon").toggleClass("layui-icon-shrink-right");

})
</script>
    <script type="text/javascript">
        layui.use(['element', 'layer'], () => {
            var element = layui.element,$=layui.jquery;
            element.init();
            $('body').on('click', '.main>button', () => {
                
                var a = $('.dynamic-navigation');
                var b = $('.layui-layer-tips');
                a && (a.attr("tg") ? (a.animate({
                    left: 0,
                    opacity: "show"
                }, 500), a.removeAttr("tg"), b.animate({
                    left: 289,
                    opacity: "show"
                }, 500)) : (a.animate({
                    left: -200,
                    opacity: "show"
                }, 500), a.attr("tg", "1"), b.animate({
                    left: 89,
                    opacity: "show"
                }, 500)));
                
                //分开写了
                a && (a.attr("tg") ? (
                    localStorage.setItem('nav-status', 1)
                ) : (
                    localStorage.setItem('nav-status', 0)
                ));
                
            });
            
            
        })
    </script>
    
</body>
	
</html>